import 'package:flutter/material.dart';

import '../../network/Api.dart';
import '../../utils/loading.dart';
import '../../utils/snack_bar.dart';

class LoginBindWxUi extends StatelessWidget {
  final String openId;

  const LoginBindWxUi(this.openId, {Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return _LoginBindMobState(openId);
  }
}

class _LoginBindMobState extends StatefulWidget {
  final String openId;

  const _LoginBindMobState(this.openId, {Key? key}) : super(key: key);

  @override
  State<_LoginBindMobState> createState() => _LoginBindMobStateState();
}

class _LoginBindMobStateState extends State<_LoginBindMobState> {
  // 登录按钮颜色选择器
  var _loginBtnSelector = [0xFFF5F6F6, 0xFF222222];
  final _loginBtnEnable = [0xFFFB6D99, 0xFFFFFFFF];
  final _loginBtnUnable = [0xFFF5F6F6, 0xFF222222];

  final _mobController = TextEditingController();

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            // 标题
            Container(
              margin: const EdgeInsets.fromLTRB(20, 130, 0, 0),
              child: const Text(
                "绑定手机号",
                style: TextStyle(fontSize: 30, color: Color(0xFF222222)),
              ),
            ),
            // 输入框
            Container(
              margin: const EdgeInsets.fromLTRB(20, 48, 20, 0),
              height: 42,
              child: TextField(
                controller: _mobController,
                maxLength: 11,
                keyboardType: TextInputType.phone,
                cursorColor: const Color(0xFFFB6D99),
                style: const TextStyle(fontSize: 18, color: Color(0xFF222222)),
                decoration: const InputDecoration(
                    hintText: "请输入手机号",
                    counterText: "",
                    border: InputBorder.none,
                    hintStyle: TextStyle(color: Color(0xFF999999)),
                    focusedBorder: UnderlineInputBorder(
                        borderSide: BorderSide(color: Color(0xFFEBEBEB))),
                    enabledBorder: UnderlineInputBorder(
                        borderSide: BorderSide(color: Color(0xFFEBEBEB)))),
                onChanged: (e) {
                  setState(() {
                    _loginBtnSelector =
                        e.length >= 11 ? _loginBtnEnable : _loginBtnUnable;
                  });
                },
              ),
            ),
            // 输入框小提示
            Container(
              padding:
                  const EdgeInsets.symmetric(vertical: 12.0, horizontal: 20.0),
              child: const Text(
                "未注册的手机号验证后自动创建都肆商圈ouran账户",
                style: TextStyle(fontSize: 13, color: Color(0xFF999999)),
              ),
            ),
            // 登录按钮
            GestureDetector(
              child: Container(
                  margin: const EdgeInsets.symmetric(
                      vertical: 12.0, horizontal: 20.0),
                  height: 48,
                  decoration: ShapeDecoration(
                      shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(24)),
                      color: Color(_loginBtnSelector[0])),
                  width: double.maxFinite,
                  child: Center(
                    child: Text(
                      "获取短信验证码",
                      style: TextStyle(
                          color: Color(_loginBtnSelector[1]), fontSize: 15),
                    ),
                  )),
              onTap: () {
                _sendVerifyCode();
              },
            ),
          ],
        ),
      ],
    );
  }

  _sendVerifyCode() {
    if (_mobController.text.length != 11) {
      return;
    }
    loading(() async {
      final res = await Api.getInstance().loginSendCode(_mobController.text);
      if (res['code'] == 0) {
        if (res['data'] != null && res['data']['sig'] != null) {
          // Navigator.of(context).push(MaterialPageRoute(builder: (ctx) => LoginVerifyCode(_mobController.text, "openID:${widget.openId}","","")));
        } else {
          ThemeSnackBar.show(context, "验证码发送失败");
        }
      } else {
        ThemeSnackBar.show(context, res['msg']);
      }
    });
  }
}
